
var btn=document.querySelector("button");
var ul=document.querySelector("ul");
var allCloseElement= document.getElementsByClassName("close");
var ulElement=document.querySelector("ul");

btn.onclick=addTo;
allCloseElement.onclick=dle
ulElement.onclick=toUpdate
// 添加待办事项
function addTo(){
    // console.log(ul.innerHTML)
        if(inputContent=""){
            alert("请输入内容")
        }else{
            var inputContent=document.querySelector("input").value;
            ul.innerHTML+="<li>"+inputContent+"<span class='close'>X</span></li>"
            document.querySelector("input").value=""
            dle()
        }
};

//删除待办事项
function dle(){
    var allCloseElement= document.getElementsByClassName("close");
    for(var i=0; i<allCloseElement.length; i++){
        allCloseElement[i].onclick=function(){
            // this.parentElement.style.display="none"
            this.parentElement.remove()
        }
    }
}

// 修改待办事项的1状态
function toUpdate(eve){
    if(eve.target.tagName==="LI"){
        eve.target.classList.toggle("checked")
        // toggle()  该方法是添加或删除class的，
        // 如果该li里面有class类点击就会删除该类
        // 如果该li里面没有class类点击就会添加该类
    }
}
